<template>
	<com-image :enablePreview="enablePreview" :borderRadius="size" :style="[rootStyle]" :lazy-load="lazyLoad" :src="src" mode="aspectFill">
		<template v-slot:loading>
			<com-icon name="round_people_fill" :size="tipSize" color="#eee"></com-icon>
		</template>
		<template v-slot:error>
			<com-icon name="round_people_fill" :size="tipSize" color="#eee"></com-icon>
		</template>
	</com-image>
</template>

<script>
	import { pixelunit } from '@/assets/js/util.js'
	export default {
		props: {
			size: {
				type: [Number,String],
				default: 100
			},
			src: {
				type: String,
				default: ''
			},
			lazyLoad: {
				type: Boolean,
				default: false
			},
			enablePreview: {
				type: Boolean,
				default: false
			}
		},
		computed: {
			rootStyle () {
				return {
					width: pixelunit(this.size),
					height: pixelunit(this.size)
				}
			},
			tipSize () {
				return pixelunit(this.size / 2)
			}
		}
	}
</script>

<style>
</style>
